<style>
    /*
    图片
     */
    #layui-upload-box li {
        width: 120px;
        height: 100px;
        float: left;
        position: relative;
        overflow: hidden;
        margin-right: 10px;
        border: 1px solid #ddd;
    }

    #layui-upload-box li img {
        width: 100%;
    }

    #layui-upload-box li p {
        width: 100%;
        height: 22px;
        font-size: 12px;
        position: absolute;
        left: 0;
        bottom: 0;
        line-height: 22px;
        text-align: center;
        color: #fff;
        background-color: #333;
        opacity: 0.6;
    }

    #layui-upload-box li i {
        display: block;
        width: 20px;
        height: 20px;
        position: absolute;
        text-align: center;
        top: 2px;
        right: 2px;
        z-index: 999;
        cursor: pointer;
    }

    /*
    组图
     */
    #layui-upload-box-multi li {
        width: 120px;
        height: 100px;
        float: left;
        position: relative;
        overflow: hidden;
        margin-right: 10px;
        border: 1px solid #ddd;
    }

    #layui-upload-box-multi li img {
        width: 100%;
    }

    #layui-upload-box-multi li p {
        width: 100%;
        height: 22px;
        font-size: 12px;
        position: absolute;
        left: 0;
        bottom: 0;
        line-height: 22px;
        text-align: center;
        color: #fff;
        background-color: #333;
        opacity: 0.6;
    }

    #layui-upload-box-multi li i {
        display: block;
        width: 20px;
        height: 20px;
        position: absolute;
        text-align: center;
        top: 2px;
        right: 2px;
        z-index: 999;
        cursor: pointer;
    }
</style>
<script>
    var multiImages = [];
    var multiFiles = [];

    var multiImagesVal = $('.multiImage').val();
    var multiFilesVal = $('.multiFiles').val();

    if (multiImagesVal) {
        multiImages = multiImagesVal.split(',');
    }

    if (multiFilesVal) {
        multiFiles = multiFilesVal.split(',');
    }

    layui.use(['upload', 'laydate'], function () {
        var startDate = layui.laydate;
        startDate.render({
            elem: '#start_time',
            type: 'datetime',
            done: function (value, date, endDate) {
                var startDate = new Date(value).getTime();
                var endTime = new Date($('#end_time').val()).getTime();
                if (endTime < startDate) {
                    layer.msg('结束时间不能小于开始时间');
                    $('#start_time').val($('#end_time').val());
                }
            }
        });
        var endData = layui.laydate;
        endData.render({
            elem: '#end_time',
            type: 'datetime',
            done: function (value, date, endDate) {
                var startDate = new Date($('#start_time').val()).getTime();
                var endTime = new Date(value).getTime();
                if (endTime < startDate) {
                    layer.msg('结束时间不能小于开始时间');
                    $('#end_time').val($('#start_time').val());
                }
            }
        });
        //图片上传
        var upload = layui.upload;
        upload.render({
            elem: '#uploadPic'
            , url: '{{ route("upload.image") }}'
            , multiple: false
            , data: {"_token": "{{ csrf_token() }}"}
            , before: function (obj) {
                obj.preview(function (index, file, result) {
                    $('#layui-upload-box').html('<li><img src="' + result + '" /><p>上传中</p></li>');
                });
            }
            , done: function (res) {
                if (res.code == 0) {
                    $('#thumb').val(res.url);
                    $('#layui-upload-box li p').text('上传成功');
                    return layer.msg(res.msg, {icon: 6});
                }
                return layer.msg(res.msg, {icon: 5});
            }
        });
        //上传视频
        var uploadVideo = layui.upload;
        uploadVideo.render({
            accept: 'file',
            elem: '#uploadVideo'
            , url: '{{ route("upload.video") }}'
            , multiple: false
            , data: {"_token": "{{ csrf_token() }}"}
            , before: function (obj) {
                obj.preview(function (index, file, result) {
                    $('#layui-upload-box-video').html('<li><p>上传中</p></li>');
                });
            }
            , done: function (res) {
                if (res.code == 0) {
                    $('#video_url').val(res.url);
                    $('#layui-upload-box-video li p').text('上传成功');
                    return layer.msg(res.msg, {icon: 6});
                }
                return layer.msg(res.msg, {icon: 5});
            }
        });
        //多图片上传
        var uploadMultiImage = layui.upload;
        uploadMultiImage.render({
            elem: '#uploadMultiImage'
            , url: '{{ route("upload.image") }}'
            , multiple: true
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#layui-upload-box-multi').append('<li><i onclick="delMultiImages($(this))">x</i><img src="'
                        + result + '" alt="' + file.name + '" title="点击删除" class="layui-upload-img" />' +
                        '<p>上传中</p></li>');
                });
            }
            , done: function (res) {
                if (res.code == 0) {
                    multiImages.push(res.url);
                    $('#layui-upload-box-multi li p').text('上传成功');
                    $('.multiImage').val(multiImages);
                } else {
                    //提示信息
                    return layer.msg(res.msg, {icon: 5});
                }
            }
        });
        //上传图片
        var uploadMultiFile = layui.upload;
        uploadMultiFile.render({
            accept: 'file',
            elem: '#uploadMultiFile'
            , url: '{{ route("upload.file") }}'
            , multiple: true
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#layui-upload-box-multi-file').append('<li onclick="delMultiFiles(this)"><span>'
                        + file.name + '</span><p>上传中</p></li>');
                });
            }
            , done: function (res) {
                if (res.code == 0) {
                    multiFiles.push(res.url);
                    $('#layui-upload-box-multi-file li p').text('上传成功');
                    $('.multiFiles').val(multiFiles);
                } else {
                    //提示信息
                    return layer.msg(res.msg, {icon: 5});
                }
            }
        });

        var uploadMultiFileLot = layui.upload;
        uploadMultiFileLot.render({
            accept: 'file',
            elem: '#uploadMultiFileLot'
            , url: '{{ route("upload.file",['type'=>1]) }}'
            , multiple: true
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#layui-upload-box-multi-file').append('<li onclick="delMultiFiles(this)"><span>'
                        + file.name + '</span><p>上传中</p></li>');
                });
            }
            , done: function (res) {
                if (res.code == 0) {
                    multiFiles.push(res.url);
                    $('#layui-upload-box-multi-file li p').text('上传成功');
                    $('.multiFiles').val(multiFiles);
                } else {
                    //提示信息
                    return layer.msg(res.msg, {icon: 5});
                }
            }
        });
    });

    function delMultiImages(this_img) {
        var subscript = $('#layui-upload-box-multi li').index(this_img.parent());
        this_img.parent('li').remove();
        multiImages.splice(subscript, 1);
        multiImages.sort();
        $('.multiImage').val(multiImages);
        return true;
    }

    function delMultiFiles(this_file) {
        var subscript = $('#layui-upload-box-multi-file li').index(this_file);
        this_file.remove();
        multiFiles.splice(subscript, 1);
        multiFiles.sort();
        $('.multiFiles').val(multiFiles);
        return true;
    }
</script>